<template>
	<view class="celebritydetaile">
		<view class="celebrity_top" :style="{backgroundImage:'url('+photo_cdn+celebrity_info.photo+')'}">
			<view class="inner"></view>
			<view class="celebrity_info_img">
				<image class="celebrity_info_img_tag" :src="photo_cdn+celebrity_info.photo" mode="aspectFill"></image>
			</view>
			<view class="celebrity_name">{{celebrity_info.name}}</view>
			<view class="celebrity_tag">
				
				<view class="celebrity_tag_box" v-for="(item,index) in tagList" :key="index">
					<view class="celebrity_tag_item">
						<view class="celebrity_tag_img" :style="{backgroundImage:'url('+photo_cdn+item.img+')'}"></view>	
					</view>
					<view class="celebrity_tag_name">{{item.name}}</view>
				</view>
				
				<!-- 在线祭祀 -->
				<!-- #ifdef MP-WEIXIN -->
				<view class="celebrity_tag_box" @tap="sacrifice(2,celebrity_info)">
					<view class="celebrity_tag_item">
						<view class="celebrity_tag_img" :style="{backgroundImage:'url('+photo_cdn+'zpupload/static/jisi.png'+')'}"></view>	
					</view>
					<view class="celebrity_tag_name"  >在线祭祀</view>
				</view>
				<!-- #endif -->
				
			</view>
		</view>
		<view class="celebrity_foot">
			<view class="foot_info">
				<view class="foot_info_title">简介</view>
				<view class="foot_info_text">{{displayText}}</view>
				<view class="deploy_img" v-if="!expanded && celebrity_info.ext3 && celebrity_info.ext3.length > limit"  @tap="expanded = true" :style="{backgroundImage:'url('+photo_cdn+'zpupload/20240104/5617756593015e1de1.png)'}"></view>
				<view class="deploy_img" v-if="expanded && celebrity_info.ext3 && celebrity_info.ext3.length > limit"  @tap="expanded = false" :style="{backgroundImage:'url('+photo_cdn+'zpupload/20240104/258d1c989517a6c955.png)'}"></view>		
			</view>
			
			<view class="foot_info">
				<view class="foot_info_tag">
					<view class="foot_info_title">基础资料</view>
					<view class="infotxt">更多  ></view>
				</view>
				<view class="foot_info_tag">
					<view class="foot_infotxt">主要成就</view>
					<view class="infotxt">{{celebrity_info.ext11 || ''}}</view>
				</view>
				<view class="foot_info_tag">
					<view class="foot_infotxt">主要领域</view>
					<view class="infotxt">{{celebrity_info.ext10 || ''}}</view>
				</view>
				<view class="foot_info_tag">
					<view class="foot_infotxt">出生地点</view>
					<view class="infotxt">{{celebrity_info.ext9 || ''}}</view>
				</view>
				<view class="foot_info_tag">
					<view class="foot_infotxt">出生时间</view>
					<view class="infotxt">{{celebrity_info.ext1 || ''}}</view>
				</view>
				<view class="foot_info_tag">
					<view class="foot_infotxt">逝世时间</view>
					<view class="infotxt">{{celebrity_info.ext13 || ''}}</view>
				</view>
				<view class="foot_info_tag">
					<view class="foot_infotxt">别称</view>
					<view class="infotxt">{{celebrity_info.ext15 || ''}}</view>
				</view>
				<view class="foot_info_tag">
					<view class="foot_infotxt">祖籍</view>
					<view class="infotxt">>{{celebrity_info.ext16 || ''}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {familyPeopleInfo,eternalHallInfo} from "@/utils/api/zupu.js";
	import config from "@/utils/config.js";
	let {
		photo_cdn
	} = config.baseUrl;
	export default {
		data(){
			return {
				photo_cdn,
				people_id:0,
				celebrity_info:{},
				limit:120,
				expanded: false,
				tagList:[
					{
						name:'资料库',
						img:'zpupload/20240104/00d9fb473dfba073b3.png'
					},
					{
						name:'族谱',
						img:'zpupload/20240104/06b53c9a655edb97fa.png'
					},
					{
						name:'千古流芳',
						img:'zpupload/20240104/51772c79e33656f12d.png'
					},
					{
						name:'相关作品',
						img:'zpupload/20240104/504afc8c19cb94f1c6.png'
					}
				]
			}
		},
		computed:{
			displayText(){
				if(this.expanded){
					return this.celebrity_info.ext3
				}else{
					if(this.celebrity_info.ext3){
						if(this.celebrity_info.ext3.length>this.limit) {
							return this.celebrity_info.ext3.slice(0,this.limit) + '...'
						}else{
							return this.celebrity_info.ext3
						}
					}
					
				}
			},
		},
		onLoad(option) {
			this.people_id = option.people_id?option.people_id:"";
			this.familyPeopleInfofun();
		},
		methods:{
			familyPeopleInfofun(){
				familyPeopleInfo({
					people_id:this.people_id,
					type:1
				}).then((res)=>{
					if(res.code==1){
						this.celebrity_info = res.data;
					}
				})
			},
			//在线祭祀
			sacrifice(type,e){
				let sacriurl = "";//去祭祀
				let hallurl = "";//去创建灵堂
				let people_id = '';
				let member_name = '';
				if(type==1){
					people_id = e.id
					member_name = e.name
					sacriurl = `/pages/zupu/sacrifice/sacrifice?people_id=${e.id}`
					hallurl = `/pages/zupu/create_mourning/create_mourning?people_id=${e.id}`
				}else if(type==2){
					people_id = e.id
					member_name = e.name
					sacriurl = `/pages/zupu/sacrifice/sacrifice?people_id=${e.id}`
					hallurl = `/pages/zupu/create_mourning/create_mourning?people_id=${e.id}`
				}
				eternalHallInfo({
					people_id:people_id 
				}).then((res)=>{
					if(res.code==1){
						uni.navigateTo({
							url:sacriurl
						})
					}
					if(res.code==0){
						if(this.identity_types==0){
							this.$api.msg(`${member_name}暂时还未创建灵堂`)
							return false;
						}
						this.$showModal({
							title:'提示',
							concent:`${member_name}还未创建灵堂，是否去创建？`,
							confirmVal:'确定',
							cancelVal:'取消',
						}).then(res=>{
							// if(this.userInfo.is_shaikh==0){
							// 	this.$api.msg("您暂时没有创建灵堂的权限！")
							// }else if(this.userInfo.is_shaikh==1){
								uni.navigateTo({
									url:hallurl
								})
							// }
						}).catch(err=>{
							console.log(err)
						})
					}
					if(res.code==-1){
						this.$api.msg(res.msg);
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	@import "./celebritydetaile.scss";
</style>